<template>
  <div class="app-container">


    <!-- vxe检索数据组件 -->
    <search-form
      ref="searchForm"
      :formSearchData.sync="formSearchData"
      :bsCvCodeOptions="baseCurveSelectOptions"
      :tfCvCodeOptions="transferCurveSelectOptions"
      @searchEventEmit="searchEventEmit"
      @resetSearchEventEmit="resetSearchEventEmit"
    >
    </search-form>


    <!-- 表格组件 -->
    <ex-base-table
      ref="exBaseTable"
      :tableColumn="tableColumn"
      :tableData="tableData"
      :loading.sync="loading"
      :isVxeCheckbox="false"
      :handleColsWidth="380"
      @handleRemoveEmit="handleRemoveEmit"
      @handleCreateEmit="handleCreateEmit"
      @handleUpdateEmit="handleUpdateEmit"
      @handleRmoveColEmit="handleRmoveColEmit"
      @customSortMethodEmit="customSortMethodEmit"
    >
    <!-- 操作栏按钮扩展插槽 -->
      <template v-slot:handleExtend="{row}">
        &nbsp;
        <el-button type="text" size="mini" @click="handleCurveMaintenance(row)">
          <!-- 修改 -->
          组成因子
        </el-button>
        &nbsp;
        <el-button type="text" size="mini" @click="handleCorrelationFactorEvent(row)">
          <!-- 修改 -->
          关联因子
        </el-button>
          &nbsp;
        <el-button size="mini" type="text" @click="viewSonTable(row)">
          入参
        </el-button>
        &nbsp;
        <el-popconfirm
          :confirm-button-text="$t('base.affirm')"
          :cancel-button-text="$t('base.cancel')"
          icon="el-icon-info"
          icon-color="red"
          title="确定同步？"
          @confirm="synctcd(row)"
        >
          <el-button slot="reference" size="mini" type="text">同步</el-button>
        </el-popconfirm>
      </template>
    

    </ex-base-table>

    <!-- 分页组件 -->
    <Pagination
      v-show="tablePage.totalResult>0"
      :total="tablePage.totalResult"
      :page.sync="tablePage.currentPage"
      :limit.sync="tablePage.pageSize"
      @pagination="pageFindList"
    />


    <!-- 表单提价组件 -->
    <submit-form
      ref="submitForm"
      :dialogFormVisible.sync="dialogFormVisible"
      :dialogStatus="dialogStatus"
      :formSubmitData="formSubmitData"
      :transferCurveOptions="transferCurveOptions"
      :baseCurveOptions="baseCurveOptions"
      :lpOptions="lpOptions"
      @handleFromUpdateDataEmit="handleFromUpdateDataEmit"
      @handleFromCreateDataEmit="handleFromCreateDataEmit"
      @resetFormDataEmit="resetFormSubmitData"
      @bsCvCodeChangeEmit="bsCvCodeChangeEmit"
    >
    </submit-form>


    <!-- 弹框表单-组成因子- -->
    <el-dialog
      title="组成因子"
      width="827px"
      :visible.sync="dialogFactorVisible"
    >
      <FactorTransfer
        :titles="['待选','已选']"
        :value.sync="factorValue"
        :data="factorData"
        :currentRow="currentRow"
        @factortransferEmit="factortransferEmit"
      />

    </el-dialog>

    <!-- 关联因子 CorrelationFactorTabs -->
    <correlation-factor-tabs
      ref="correlationFactorTabs"
      :textMap="textMap"
      :currentRow="currentRow"
      :factorSelected="factorSelected"
      :dialogCorrelationFactorTabsVisible.sync="dialogCorrelationFactorTabsVisible"
    >
    </correlation-factor-tabs>

    <!-- 入参 -->
    <el-dialog 
    width="80%"
      :visible.sync="DialogSonTableVisible"
      >
      <ParamValMaintainTable
        ref="paramValMaintainTable"
        :currentRow = "currentRow"
       />
    </el-dialog>




  </div>
</template>

<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
// import PageHeaderLayout from '@/layouts/PageHeaderLayout'
// import ApeDrawer from '@/components/ApeDrawer'
// import { mapGetters } from 'vuex'
import cvoptions from '@/views/CurveManageNew/mixins/cvoptions'
import XEUtils from 'xe-utils'
// 组成因子-组件
import FactorTransfer from './components/FactorTransfer'
// 入参
import ParamValMaintainTable from './components/ParamValMaintainTable'
// 关联因子
import CorrelationFactorTabs from './components/CorrelationFactorTabs'

import {
  findAdjustTheItemGenerationScenario_m,
  insertFindAdjustTheItemGenerationScenario_m,
  updateAdjustTheItemGenerationScenario_m,
  daleteTransferCurveGp,
  deletetransferCurveGpBatch,
  fingfactorcodename,
  fingfactorcodenamein,
  addfactor
} from './service/baseApi'


// 基础表格组件
import ExBaseTable from '@/components/VxeTable/ExBaseTable'
// 分页
import Pagination from '@/components/Pagination'
// 文章表单
import SubmitForm from './components/SubmitForm'
// 检索表单
import SearchForm from './components/SearchForm'
//信息提示框
import {MessageBox, Message} from 'element-ui'
import resetFormSubmitData from '@/views/mixins/resetFormSubmitData'

export default {
  name: 'vxe-basetable',
  mixins: [cvoptions,resetFormSubmitData],
  components: {
    //PageHeaderLayout,
    ExBaseTable,
    Pagination,
    SubmitForm,
    SearchForm,
    FactorTransfer,
    ParamValMaintainTable,
    CorrelationFactorTabs
  },
  // 定义属性
  data() {
    return {
      // 检索条件
      formSearchData: {
        pg_code: '',
        pg_name: ''
      },

      // 排除条件
      sortField: '',
      sortFlag: '',

      /* 表单相关 */
      dialogFormVisible: false, // 修改删除弹出框
      dialogStatus: '',
      // 表单数据对象
      formSubmitData: {
        id: "",
        pg_code: '', //方案编码
          pg_name: '', //方案名称
          lp_code: '', //所属法人
          s_date: '', //生效日期
          e_date: '', //失效日期
          pg_type: '', //代码类型
          pg_text: '', //路径+程序名/代码描述
          remark: '', //备注
      },
      lpOptions: [],
      initFormSubmitData : {
          id: "",
          lp_code: "123456",
          cv_gp_code: '',
          cv_gp_name: '',
          status: '1',
          remark: '',
        },

      /* 分页相关 */
      tablePage: {
        currentPage: 1, //当前页
        pageSize: 10,  // 每一页页数
        totalResult: 0
      },
      /* 表格相关 */
      tableColumn: [], // 表格字段
      loading: false, //表格loading特效
      tableData: [],  //表格数据
      /* 弹框状态-组成因子--开始 */
      dialogFactorVisible: false,
      factorValue: [],
      factorData: [],
       /* 弹框状态-组成因子--结束 */
      currentRow:{},
      /* 入参 */
      DialogSonTableVisible:false,

       /* 关联因子 */
      textMap: "XXX关联因子",  /*  TOTO:  子组件弹框标题待定 */
      dialogCorrelationFactorTabsVisible: false,
      factorSelected:[], //已选因子


    } //datareturn-end

  },
  // 计算属性，会监听依赖属性值随之变化
  computed: {},
  // 监控data中的数据变化
  watch: {},
  // 方法集合
  methods: {


    /* API数据操作相关 */
    
    /* 组成因子选项-所有 */
    findTransfercurveGpFingTransferCurvecodename(rowId){
      fingfactorcodename({
        id:rowId
      }).then(({data})=>{
        this.factorData = XEUtils.map(data.rows, (item) => {
          return {
            label: `${item.adj_ft_code}-${item.adj_ft_name}`,
            key: item.adj_ft_code,
            disabled: false
          }
        })
      });
    },
    /* 组成因子选项-被选中的参数 query:id */
    async findTransfercurveGpFingTransferCurvecodenamein(val,actionType='zuchengyinzi'){
     return await fingfactorcodenamein({
        id:val
      }).then(({data})=>{

        if (actionType === 'guanlianyinzi') {
          if (XEUtils.isEmpty(data.rows)) {
            this.$message({
              message: '没有关联的因子',
              type: 'warning'
            });
            return false
          }else{
            this.factorSelected = data.rows
          }
        }else{
          this.factorValue = []
          XEUtils.arrayEach(data.rows, (item,key) => {
            this.factorValue.push(item.adj_ft_code)
          })

        } 
        return true

      });


    },
    // 修改组成因子参数
    findTransfercurveGpAddTransferCurveGpZi(val){
      addfactor({
        id:this.currentRow.id,
        adj_ft_code:val
      })
    },
    // 查询数据
    findList() {
      this.loading = true
      // 请求表格数据
      findAdjustTheItemGenerationScenario_m({
        page: this.tablePage.currentPage, // 当前页
        pageSize: this.tablePage.pageSize, // 每页条数
        sortField: this.sortField,
        sortFlag: this.sortFlag,
        ...this.formSearchData,  //检索条件
      }).then(({data}) => {
        // 给表格数据赋值
        this.tableData = data.rows
        // 给分页总数赋值
        this.tablePage.totalResult = data.total
        // 关闭加载特效
        setTimeout(() => {
          this.loading = false
        }, 0.5 * 1000)
      })
    },

    /* 分页组件相关 */
    // 分页事件（页码切换，每页页数切换）
    pageFindList() {

      this.findList()
    },
    /* 表格组件相关 */
    // 初始化表格字段
    initTableCols() {
      const tabCols = [  //动态增加的字段 传进来的 
        {field: 'pg_code', title: '方案编码', width: 200,sortable: true},
        {field: 'pg_name', title: '方案名称', width: 200},
        {field: 'lp_code', title: '所属法人', width: 300 ,formatter(obj){
          if(obj.cellValue == 123456){
            return "中金公司"
          }
        }},
        {field: 's_date', title: '生效日期', width: 200,sortable: true},
        {field: 'e_date', title: '失效日期', width: 200},
        {field: 'pg_type', title: '代码类型', width: 300 ,formatter(obj){
          if (obj.cellValue == 1) {
              return "JAVA"
            } else {
              return "SQL"
            }
        }
        },
        { field: 'pg_text', title: '路径+程序名/代码描述', width: 300 },
        // { field: 'mod_date', title: '修改时间', width: 300 },
        {
          field: 'status', title: '同步状态', width: 300, formatter(obj) {
            if (obj.cellValue == 1) {
              return "有效"
            } else if(obj.cellValue == 0){
              return "无效"
            }else if(obj.cellValue == 2){
              return "同步中"
            }else if(obj.cellValue == 3){
              return "同步失败"
            }else if(obj.cellValue == 4){
              return "同步成功"
            }
          }
        },
        {field: 'remark', title: '备注', width: 300}
      ]
      this.tableColumn = tabCols;
    },
    // 表格工具组-多选删除
    handleRemoveEmit(selectRecords) {
      // this.$refs.exBaseTable.$refs.xTable.removeCheckboxRow()
      deletetransferCurveGpBatch({
        ...selectRecords
      }).then(({data}) => {
        this.findList()
      })
    },
    // 表格工具组-新增表单弹窗（需要表单组件）
    handleCreateEmit(type) {
      // 重置表单内容
      this.resetFormSubmitData()
      this.dialogStatus = type
      this.dialogFormVisible = true
      this.$nextTick(() => {
        this.$refs.submitForm.$refs['dataForm'].clearValidate()
      })
    },
    // 行内按钮-修改数据弹窗（需要表单组件）
    handleUpdateEmit(row, type) {
      this.formSubmitData = Object.assign({}, row) // copy obj
      this.dialogStatus = type
      this.dialogFormVisible = true
      this.$nextTick(() => {
        this.$refs.submitForm.$refs['dataForm'].clearValidate()
      })
    },
    // 单行删除
    handleRmoveColEmit(row) {
      // this.$refs.exBaseTable.$refs.xTable.remove(row)
      daleteTransferCurveGp({
        id: row.id
      }).then(({data}) => {
        this.findList()
      })
    },
    
    /* 表单组件相关 */
    // 更新
    handleFromUpdateDataEmit() {
      updateAdjustTheItemGenerationScenario_m({
        ...this.formSubmitData
      }).then(({data})=>{ 
        this.findList()
      })
    },

   // 增加
    handleFromCreateDataEmit() {
      insertFindAdjustTheItemGenerationScenario_m({
        ...this.formSubmitData,  //检索条件
      }).then(({data}) => {
        this.findList()
      })
    },

    /* 根据曲线code获取法人 */
    bsCvCodeChangeEmit(val) {
      tcDirectReferenceFindlpname({
        cv_code: val
      }).then(({data}) => {
        this.formSubmitData.lp_code = data.lp_code
      })
    },

    /* 检索相关 */
    // 检索
    searchEventEmit() {
      this.tablePage.currentPage = 1
      this.findList()
    },
    // 重置
    resetSearchEventEmit() {
      // 重置代码...
      this.tablePage.currentPage = 1
      this.findList()
    },
    /* 排序 */
    customSortMethodEmit(property, order) {
      this.sortField = property
      this.sortFlag = order
      this.findList()

    },
    
    /* 子表格弹出 */
    viewSonTable(row) {
      this.currentRow = Object.assign({}, row) // copy obj
      this.DialogSonTableVisible = true
    },
    /* 组成因子-弹出 */
    handleCurveMaintenance(row) {
      this.currentRow = Object.assign({}, row) // copy obj

      // 初始化组成因子数据
      this.findTransfercurveGpFingTransferCurvecodename(row.id)
      // 获取当前曲线的组成因子选项-被选中的参数
      this.findTransfercurveGpFingTransferCurvecodenamein(row.id)

      this.dialogFactorVisible = true
    },
    /* 曲线参数修改 */
    factortransferEmit(val){
      //this.findTransfercurveGpAddTransferCurveGpZi(val)
      this.findTransfercurveGpAddTransferCurveGpZi(val.join(','))
    },
    /* 同步 */
    synctcd(row) {
      // syncBCArithmeticMean({
      //   id: row.id
      // }).then(({data}) => {
      //   this.findList()
      // })
    },
     /**
     * 关联因子
     * @param {Object} row 当前定价规则节点数据
     */
    handleCorrelationFactorEvent(row) {
      this.currentRow = Object.assign({}, row) // copy obj
      // 获取当前曲线的组成因子选项-被选中的参数
     this.findTransfercurveGpFingTransferCurvecodenamein(row.id,'guanlianyinzi').then(res => {
        if (res) {
          this.dialogCorrelationFactorTabsVisible = true
        }
        
      })
      
    },

  }, //method-end
  // 生命周期 - 创建完成（可以访问当前this实例）
  created() {
    // 测试功能-下拉分页表格
    // this.keyupEvent4()
    // 初始化表格字段
    this.initTableCols()
    // 初始化表格数据
    this.findList()

    

  },
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {

  },
  beforeCreate() {
  }, // 生命周期 - 创建之前
  beforeMount() {
  }, // 生命周期 - 挂载之前
  beforeUpdate() {
  }, // 生命周期 - 更新之前
  updated() {
  }, // 生命周期 - 更新之后
  beforeDestroy() {
  }, // 生命周期 - 销毁之前
  destroyed() {
  }, // 生命周期 - 销毁完成
  activated() {
  }, // 如果页面有keep-alive缓存功能，这个函数会触发
}
</script>

<style lang='scss' scoped>


.my-dropdown4 {
  width: 600px;
  height: 300px;
  background-color: #fff;
  border: 1px solid #dcdfe6;
  box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
}
</style>